<template>
	<view class="content">
		<view style="padding: 20rpx 30rpx">
			<uni-forms :modelValue="formData">
				<uni-forms-item label="部门" prop="deptCodes" required>
					<view style="width: 100%;">
						<text style="color:#0960bd" @click="handleTkiTreeDepart()">选择</text>
						<view
							style="width:100%;max-height: 150rpx;overflow-y: auto;display: flex;gap: 10rpx;flex-wrap: wrap;">
							<view
								style="display: flex;gap:10rpx;border: 1rpx solid #8f939c;text-align: #8f939c;padding: 8rpx 14rpx;border-radius: 6rpx;cursor: pointer;font-weight: 200;"
								v-for="(item, index) in selectDepartmentList" :key="item.code">{{ item.name }}
								<uni-icons type="closeempty" @click="handleCloseTag(index)"></uni-icons>
							</view>
						</view>
					</view>
				</uni-forms-item>
			</uni-forms>
		</view>
		<view class="body_bottom" @click="handleOk">
			确定
		</view>
		<TkiTree idKey="code" rangeKey="name" :range="departmentList" ref="tkiTreeDepartRef"
			@confirm="handleTkiTreeDepartConfirm" />
	</view>
</template>

<script>
import TkiTree from '@/components/tki-tree/tki-tree.vue'
import {
	postFormAction,
} from '@/utils/request.js';
import { dayjs } from '@/uni_modules/iRainna-dayjs/js_sdk/dayjs.min.js'
export default {
	components: {
		TkiTree
	},
	data() {
		return {
			formData: {
				deptCodes: ''
			},
			departmentList: [],
			selectDepartmentList: [],
			deptCode: ''
		}
	},
	onLoad(options) {
		this.deptCode = options.deptCode || ''
		this.getDepartmentsData()
	},
	methods: {
		dayjs,
		//选择部门
		handleTkiTreeDepart() {
			this.$refs.tkiTreeDepartRef._show()
		},
		//部门回调
		handleTkiTreeDepartConfirm(e) {
			let departmentSelected = []
			if (e && e.length) {
				departmentSelected = [e[0]]
			}
			this.selectDepartmentList = departmentSelected

		},
		//删除已选
		handleCloseTag(index) {
			this.selectDepartmentList.splice(index, 1)
			this.$forceUpdate()
		},
		getDepartmentsData() {
			try {
				uni.showLoading({
					title: '查询中',
					mask: true
				})

				let params = {};
				postFormAction('/department/getDepartments', params).then((res) => {
					const {
						data
					} = res
					this.departmentList = data || [];
				});
			} catch (e) {
				console.error(e)
			} finally {
				uni.hideLoading()
			}
		},
		handleOk() {
			if (this.selectDepartmentList.length == 0) {
				uni.showToast({
					title: '部门不能为空',
					icon: "none"
				})
				return
			}
			try {
				uni.showLoading({
					title: '保存中',
					mask: true
				})

				let params = {
					deptCode: this.deptCode,
					agentDeptCode: this.selectDepartmentList[0].code,
					agentDate: dayjs().format('YYYY-MM-DD'),
				};
				console.log("params", params)
				postFormAction('/message_oa/setAgent', params).then((res) => {
					const {
						data
					} = res
					if (data.res == 0) {
						this.handleReturn()
					}
				});
			} catch (e) {
				console.error(e)
			} finally {
				uni.hideLoading()
			}
		},
		handleReturn() {
			var pages = getCurrentPages();
			// var currPage = pages[pages.length - 1]; //当前页面
			var prevPage = pages[pages.length - 2]; //上一个页面
			prevPage.isDoRefresh = true
			uni.navigateBack()
		},
	}
}
</script>

<style lang="scss" scoped>
.content {
	padding-bottom: 120rpx;

}

.body_bottom {
	position: fixed;
	z-index: 10;
	bottom: 0;
	height: 100rpx;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-around;
	gap: 20rpx;
	background: #FFFFFF;
	box-shadow: 0rpx -2rpx 16rpx 0rpx rgba(0, 0, 0, 0.1);
}
</style>